// /**
// //  * Magento
//  *
//  * NOTICE OF LICENSE
//  *
//  * This source file is subject to the Academic Free License (AFL 3.0)
//  * that is bundled with this package in the file LICENSE_AFL.txt.
//  * It is also available through the world-wide-web at this URL:
//  * http://opensource.org/licenses/afl-3.0.php
//  * If you did not receive a copy of the license and are unable to
//  * obtain it through the world-wide-web, please send an email
//  * to license@magentocommerce.com so we can send you a copy immediately.
//  *
//  * DISCLAIMER
//  *
//  * Do not edit or add to this file if you wish to upgrade Magento to newer
//  * versions in the future. If you wish to customize Magento for your
//  * needs please refer to http://www.magentocommerce.com for more information.
//  *
//  * @category    design
//  * @copyright   Copyright (c) 2014 X.commerce, Inc. (http://www.magentocommerce.com)
//  * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
//  */

.data-tabs-base(@_tab-control-height-base: @tab-control-height-base) {
    .clearfix();
    position: relative;
    z-index: 1;
    > .item.title {
        float: left;
        width: auto;
        > .switch {
            display: block;
            height: @_tab-control-height-base;
            position: relative;
            z-index: 2;
        }
    }
    > .item.content {
        .box-sizing();
        .clearfix();
        float: right;
        margin-top: @_tab-control-height-base;
        margin-left: -100%;
        width: 100%;
        &.active {
            display: block;
        }
    }
}

.data-tabs(
    @_tab-control-font-family: @tab-control-font-family,
    @_tab-control-font-size: @tab-control-font-size,
    @_tab-control-font-style: @tab-control-font-style,
    @_tab-control-font-weight: @tab-control-font-weight,
    @_tab-control-line-height: @tab-control-line-height,

    @_tab-control-bg: @tab-control-bg,
    @_tab-control-color: @tab-control-color,
    @_tab-control-text-decoration: @tab-control-text-decoration,

    @_tab-control-color-visited: @tab-control-color,
    @_tab-control-text-decoration-visited: @tab-control-text-decoration,

    @_tab-control-bg-hover: @tab-control-bg-hover,
    @_tab-control-color-hover: @tab-control-color-hover,
    @_tab-control-text-decoration-hover: @tab-control-text-decoration,

    @_tab-control-bg-active: @tab-control-bg-active,
    @_tab-control-color-active: @tab-control-color-active,
    @_tab-control-text-decoration-active: @tab-control-text-decoration,

    @_tab-control-height: @tab-control-height,
    @_tab-control-margin-right: @tab-control-margin-right,

    @_tab-control-padding-top: @tab-control-padding-top,
    @_tab-control-padding-right: @tab-control-padding-right,
    @_tab-control-padding-bottom: @tab-control-padding-bottom,
    @_tab-control-padding-left: @tab-control-padding-left,

    @_tab-control-border-width: @tab-control-border-width,
    @_tab-control-border-color: @tab-control-border-color,

    @_tab-content-bg: @tab-content-bg,
    @_tab-content-border: @tab-content-border,
    @_tab-content-border-top-status: @tab-content-border-top-status,
    @_tab-content-margin-top: @tab-content-margin-top,

    @_tab-content-padding-top: @tab-content-padding-top,
    @_tab-content-padding-right: @tab-content-padding-right,
    @_tab-content-padding-bottom: @tab-content-padding-bottom,
    @_tab-content-padding-left: @tab-content-padding-left
) {
    .data-tabs-base();
    > .item.title {
        margin: 0 @_tab-control-margin-right 0 0;
        > .switch {
            .typography(
                @_color: @_tab-control-color,
                @_font-size: @_tab-control-font-size,
                @_font-family: @_tab-control-font-family,
                @_font-weight: @_tab-control-font-weight,
                @_font-style: @_tab-control-font-style,
                @_line-height: @_tab-control-line-height
            );
            .link(
                @_link-color: @_tab-control-color,
                @_link-text-decoration: @_tab-control-text-decoration,
                @_link-color-visited: @_tab-control-color-visited,
                @_link-text-decoration-visited: @_tab-control-text-decoration-visited,
                @_link-color-hover: @_tab-control-color-hover,
                @_link-text-decoration-hover: @_tab-control-text-decoration-hover,
                @_link-color-active: @_tab-control-color-active,
                @_link-text-decoration-active: @_tab-control-text-decoration-active
            );
            height: @_tab-control-height;
            padding: @_tab-control-padding-top @_tab-control-padding-right @_tab-control-padding-bottom @_tab-control-padding-left;
            .css(border, @_tab-content-border);
            .css(background, @_tab-control-bg);
            border-bottom: none;
        }
        &:not(.disabled) > .switch:focus,
        &:not(.disabled) > .switch:hover {
            .css(background, @_tab-control-bg-hover);
        }
        &:not(.disabled) > .switch:active,
        &.active > .switch,
        &.active > .switch:focus,
        &.active > .switch:hover {
            .css(background, @_tab-control-bg-active);
            .css(color, @_tab-control-color-active);
        }
        &.active > .switch,
        &.active > .switch:hover {
            padding-bottom: @_tab-control-padding-bottom + @_tab-control-border-width;
        }
    }
    > .item.content {
        .add-background(@_tab-content-bg);
        margin-top: @_tab-content-margin-top;
        padding: @_tab-content-padding-top @_tab-content-padding-right @_tab-content-padding-bottom @_tab-content-padding-left;
        ._tab-content-border(
            @_tab-content-border-top-status: @_tab-content-border-top-status,
            @_tab-content-border: @_tab-content-border
        );
    }
}

._tab-content-border(
    @_tab-content-border-top-status,
    @_tab-content-border
) when (@_tab-content-border-top-status = false){
    border: @_tab-content-border;
}

._tab-content-border(
    @_tab-content-border-top-status,
    @_tab-content-border
) when (@_tab-content-border-top-status = true){
    border: 0;
    border-top: @_tab-content-border;
}

.data-accordion-base() {
    margin: 0;
    padding: 0;
    > .item.title {
        .box-sizing();
        float: none;
        width: 100%;
        > .switch {
            display: block;
        }
    }
    > .item.content {
        .clearfix();
        .box-sizing();
        float: none;
        margin: 0;
        display: block;
        &.active {
            display: block;
        }
    }
}

.data-accordion(
    @_accordion-control-font-family: @accordion-control-font-family,
    @_accordion-control-font-size: @accordion-control-font-size,
    @_accordion-control-font-style: @accordion-control-font-style,
    @_accordion-control-font-weight: @accordion-control-font-weight,
    @_accordion-control-line-height: @accordion-control-line-height,

    @_accordion-control-border-top: @accordion-control-border-top,
    @_accordion-control-border-right: @accordion-control-border-right,
    @_accordion-control-border-bottom: @accordion-control-border-bottom,
    @_accordion-control-border-left: @accordion-control-border-left,

    @_accordion-control-bg: @accordion-control-bg,
    @_accordion-control-color: @accordion-control-color,
    @_accordion-control-text-decoration: @accordion-control-text-decoration,

    @_accordion-control-color-visited: @accordion-control-color,
    @_accordion-control-text-decoration-visited: @accordion-control-text-decoration,

    @_accordion-control-bg-hover: @accordion-control-bg-hover,
    @_accordion-control-color-hover: @accordion-control-color-hover,
    @_accordion-control-text-decoration-hover: @accordion-control-text-decoration-hover,

    @_accordion-control-bg-active: @accordion-control-bg-active,
    @_accordion-control-color-active: @accordion-control-color-active,
    @_accordion-control-text-decoration-active: @accordion-control-text-decoration-active,

    @_accordion-control-height: @accordion-control-height,
    @_accordion-control-margin-bottom: @accordion-control-margin-bottom,

    @_accordion-control-padding-top: @accordion-control-padding-top,
    @_accordion-control-padding-right: @accordion-control-padding-right,
    @_accordion-control-padding-bottom: @accordion-control-padding-bottom,
    @_accordion-control-padding-left: @accordion-control-padding-left,

    @_accordion-content-bg: @accordion-content-bg,
    @_accordion-content-border: @accordion-content-border,

    @_accordion-content-margin: @accordion-content-margin,
    @_accordion-content-padding: @accordion-content-padding
) {
    .data-accordion-base();
    & when (@_accordion-control-margin-bottom = 0) {
        > .item.title {
            .css(margin, 0);
        }
    }
    & when not (@_accordion-control-margin-bottom = 0) {
        > .item.title {
            .css(margin, 0 0 @_accordion-control-margin-bottom);
        }
    }
    > .item.title {
        > .switch {
            .css(background, @_accordion-control-bg);
            .css(border-top,@_accordion-control-border-top);
            .css(border-right,@_accordion-control-border-right);
            .css(border-bottom,@_accordion-control-border-bottom);
            .css(border-left,@_accordion-control-border-left);
            height: @_accordion-control-height;
            padding: @_accordion-control-padding-top @_accordion-control-padding-right @_accordion-control-padding-bottom @_accordion-control-padding-left;
            .typography(
                @_color: @_accordion-control-color,
                @_font-family: @_accordion-control-font-family,
                @_font-size: @_accordion-control-font-size,
                @_font-style: @_accordion-control-font-style,
                @_font-weight: @_accordion-control-font-weight,
                @_line-height: @_accordion-control-line-height
            );
            .link(
                @_link-color: @_accordion-control-color,
                @_link-text-decoration: @_accordion-control-text-decoration,
                @_link-color-visited: @_accordion-control-color-visited,
                @_link-text-decoration-visited: @_accordion-control-text-decoration-visited,
                @_link-color-hover: @_accordion-control-color-hover,
                @_link-text-decoration-hover: @_accordion-control-text-decoration-hover,
                @_link-color-active: @_accordion-control-color-active,
                @_link-text-decoration-active: @_accordion-control-text-decoration-active
            );
        }
        &:not(.disabled) > .switch:focus,
        &:not(.disabled) > .switch:hover {
            .css(background, @_accordion-control-bg-hover);
        }
        &:not(.disabled) > .switch:active,
        &.active > .switch,
        &.active > .switch:focus,
        &.active > .switch:hover {
            .css(background, @_accordion-control-bg-active);
            padding-bottom: @_accordion-control-padding-bottom;
        }
    }
    > .item.content {
        .css(background, @_accordion-content-bg);
        .css(border, @_accordion-content-border);
        .css(margin, @_accordion-content-margin);
        .css(padding, @_accordion-content-padding);
    }
}
